<!DOCTYPE html>
<html>

<head>
  <style>
    .container {
      display: flex;
      justify-content: space-around;
      align-items: center;
      width: 200px;
      height: 200px;
      border-radius: 10px;
      background-color: #e7e7e7;
      box-shadow: inset 0 3px #fff, inset 0 -3px #d7d7d7, inset 3px 0 #d7d7d7, inset -3px 0 #d7d7d7;
      padding: 6px;
      margin-right: 20px;
    }

    .dot {
      width: 25px;
      height: 25px;
      border-radius: 50%;
      background-color: #333;
      box-shadow: inset 0 3px #111, inset 0 -3px #555;
    }
  </style>
</head>

<body>
  <div class="container">
    <div class="dot"></div>
    <div class="dot"></div>
    <div class="dot"></div>
    <div class="dot"></div>
    <div class="dot"></div>
    <div class="dot"></div>
  </div>
</body>

</html>